$(function(){
  var page = 1;
  var pageSize = 5;
  render();
  function render(){
    $.ajax({
      url:'/category/querySecondCategoryPaging',
      type:'get',
      data:{
        page:page,
        pageSize:pageSize
      },
      success:function(info){
        console.log(info);
        $("tbody").html(template("tmp",info))
        $("#paginator").bootstrapPaginator({
          bootstrapMajorVersion:3,
          currentPage:page,
          totalPages:Math.ceil(info.total / info.size),
          onPageClicked:function(a,b,c,p){
            page = p;
            render();
          }
        })
      }
    })

  }

  $(".btn_add").on("click",function(){
    $("#addModal").modal("show");
    $.ajax({
      url:'/category/queryTopCategoryPaging',
      type:'get',
      data:{
        page:1,
        pageSize:100
      },
      success:function(info){
        console.log(info);
        $(".dropdown-menu").html(template("tmp1",info));
        
      }
    })
  })

  $(".dropdown-menu").on("click","li",function(){
    var content = $(this).children().html();
    $(".dropdown-text").html(content); 
    $("[name = categoryId]").val($(this).data("id"));  
     // 通过updateStatus方法，把校验改成成功
     $('form')
     .data('bootstrapValidator')
     .updateStatus('categoryId', 'VALID') 
  })


  $('#file').fileupload({
    // 图片上传后的回调函数
    done: function(e, data) {
      console.log(data);
      
      // 显示图片
      $('.img_box img').attr('src', data.result.picAddr)
      // 把图片地址设置给隐藏表单
      $('[name=brandLogo]').val(data.result.picAddr)

      $('form')
        .data('bootstrapValidator')
        .updateStatus('brandLogo', 'VALID')
    }
  })


  // 表单校验功能
  $('form').bootstrapValidator({
    // 让隐藏的表单也参与校验
    excluded: [],
    // 配置的校验的小图标
    feedbackIcons: {
      valid: 'glyphicon glyphicon-thumbs-up',
      invalid: 'glyphicon glyphicon-thumbs-down',
      validating: 'glyphicon glyphicon-refresh'
    },
    fields: {
      brandName: {
        validators: {
          notEmpty: {
            message: '二级分类的名称不能为空'
          }
        }
      },
      categoryId: {
        validators: {
          notEmpty: {
            message: '请选择一个一级分类'
          }
        }
      },
      brandLogo: {
        validators: {
          notEmpty: {
            message: '请上传二级分类的图片'
          }
        }
      }
    }
  })


   // 给表单注册校验成功事件
   $('form').on('success.form.bv', function(e) {
    e.preventDefault()
    $.ajax({
      type: 'post',
      url: '/category/addSecondCategory',
      data: $('form').serialize(),
      success: function(info) {
        if (info.success) {
          // 重新渲染第一页
          page = 1
          render()

          // 关闭模态框
          $('#addModal').modal('hide')

          // 重置样式
          $('form')
            .data('bootstrapValidator')
            .resetForm(true)

          // 手动重置按钮的值和图片
          $('.dropdown-text').html('请选择一级分类')
          $('.img_box img').attr('src', 'images/none.png')
        }
      }
    })
  })
})